<template>
    <div class="list-page">
        <tool-bar nav="" title="文件">
            <el-button @click="$data.add_dlg=true;">上传一个</el-button>
        </tool-bar>
        <el-dialog v-model="$data.add_dlg">

            <upload
                url="/sys/upload?group=admin"
                :maxCount="1"
                v-model="info.logo"
                :maxWidth="1024"
                maxSize="20M"
            ></upload>

	        <el-button @click="info.logo={}">清除</el-button>
	        <div>{{info.logo.url}}</div>
        </el-dialog>
        <my-list
            ref="list"
            url="/sys/file/list"
            @param="preload"
            @loaded="procData"
            :page-size="10"
            :store="true"
        >


            <el-table-column align="left" label="地址" prop="url"></el-table-column>
            <el-table-column align="left" label="大小" prop="size">
                <template v-slot="scope">
                    {{ scope.row.size_unit.value }}
                    <el-tag type="info" v-if="scope.row.size_unit.unit =='b'">kb</el-tag>
                    <el-tag type="info" v-else-if="scope.row.size_unit.unit =='kb'">kb</el-tag>
                    <el-tag type="warning" v-else-if="scope.row.size_unit.unit =='mb'">mb</el-tag>
                    <el-tag type="danger" v-else>gb</el-tag>


                </template>
            </el-table-column>
            <el-table-column align="left" label="上传时间" prop="createAt"></el-table-column>
            <el-table-column label="操作" align="center" width="120">
                <template v-slot="scope">
                    <el-button @click="open_click(scope.row)" size="small" round>
                        打开
                    </el-button>
                </template>
            </el-table-column>
            <template #query="scope">
                <kv label="桶">
                    <el-input v-model="scope.query.group"></el-input>
                </kv>
            </template>
        </my-list>
    </div>
</template>

<script setup>
/**
 * Created by CodeGenerator at 2021-04-12 12:10:50
 */
import upload from "./upload.vue"


defineOptions({
    name: "file-list",
    inheritAttrs: true,
});

//定义 vue2的this,当前组件
const $self = getCurrentInstance();

//定义 $attrs
const $attrs = useAttrs();



//定义data
const $data = reactive({add_dlg:false,info:{logo:{}}});
const info = $computed(()=> $data.info );

const $props = defineProps({
    id: { type: String } ,
    action: { type: String }
});

const action_name = $computed(()=>{
    return {add: "添加", edit: "修改"}[$props.action]
});


const list = ref();

//定义事件
const $emit = defineEmits(["update:modelValue","loaded"]);



const preload = function(param) {
//添加查询参数，修改分页参数等。
//param.type = jv.$route.params.type
};
const procData = function(res) {
    res.data.data.forEach(it => {
//如果是组合实体，设置 it.id=...
        it.size_unit = jv.size_unit(it.size);
    });
};
const loadData = function(pageNumber) {
    list.value.loadData(pageNumber);
};
const add_click = function() {
    jv.$router.push("/dev/git-server/add")
};
const edit_click = function(row) {
//记录上次点击行
    var rowId = row.id;
    list.value.setLastRow(row);
    jv.$router.push("/dev/git-server/edit/" + rowId)
};
const open_click = function(row) {
    window.open(row.url, 'f');
};

onMounted( function() {
} )



</script>
